{extend name='public/base' /}
{block name='content'}
{include file='public/content_header' /}
<section class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <!-- 表单头部 -->
                <div class="card-header">
                    <div class="btn-group">
                        <a class="btn flat btn-sm btn-default BackButton">
                            <i class="fas fa-arrow-left"></i>
                            返回
                        </a>
                    </div>
                </div>
                <!-- 表单 -->
                <form id="dataForm" class="form-horizontal dataForm" action="" method="post"
                    enctype="multipart/form-data">
                    <!-- 表单字段区域 -->

                    <div class="card-body">
                        <div class="form-group row">
                            <label for="name" class="col-sm-2 col-form-label ">名称</label>
                            <div class="col-sm-10 col-md-4 formInputDiv">
                                <input id="name" name="name" value="{$data.name|default=''}" placeholder="请输入名称"
                                    type="text" maxlength="50" class="form-control field-text">
                            </div>
                        </div>
                       

                        <div class="form-group row">
                            <label for="log_method" class="col-sm-2 col-form-label ">域名</label>
                            <div class="col-sm-10 col-md-4 formInputDiv">
                                <select class="form-control select2bs4" id="domain_method" name="domain"
                                    data-placeholder="选择域名">
                                    {foreach name='domain_list' id='item'}
                                    <option value="{$item.url}" {if isset($data)&&$data.domain==$item.url}selected{/if}>
                                        {$item.url} - {$item.count}</option>
                                    {/foreach}
                                </select>
                            </div>
                            <script>
                                $('#domain_method').select2({
                                    theme: 'bootstrap4'
                                })
                            </script>
                        </div>  
                        <div class="form-group row">
                            <label for="log_method" class="col-sm-2 col-form-label ">模板</label>
                            <div class="col-sm-10 col-md-4 formInputDiv">
                                <input id="name" name="template_id" value="{$data.template_id|default=''}" placeholder="请输入名称"
                                    type="text" maxlength="50" class="form-control field-text">
                            </div> 
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-2 col-form-label ">客服</label>
                            <div class="col-sm-10 col-md-10">
                                <table id="settingSetting" class="table table-hover table-bordered datatable"
                                    width="100%">
                                    <thead>
                                        <tr class="input-type">
                                            <th>操作</th>
                                            <th>链接</th>
                                        </tr>
                                    </thead>
                                    <tbody id="dataBody">
                                        {if isset($data)}
                                        {foreach name='data.kefu' id='item'}
                                        <tr>
                                            <td>
                                                <a class="btn btn-xs btn-primary" onclick="addNew(this,1)">插入</a>
                                                <a class="btn btn-xs btn-success" onclick="addNew(this,2)">追加</a>
                                                <a class="btn btn-xs btn-danger" onclick="delThis(this,1)">删除</a>
                                            </td>
                                            <td>
                                                <input class="form-control" placeholder="名称" value="{$item}" name="kefuarr[]">
                                            </td>
                                        </tr>
                                        {/foreach}
                                        {/if}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <!-- 表单底部 -->
                    <div class="card-footer">
                        <div class="row">
                            <div class="col-sm-2">
                            </div>

                            <div class="col-sm-10 col-md-4 formInputDiv">

                                <div class="btn-group">
                                    <button type="submit" class="btn btn-sm btn-primary dataFormSubmit">
                                        保 存
                                    </button>
                                </div>
                                <div class="btn-group">
                                    <button type="reset" class="btn btn-sm btn-default dataFormReset">
                                        重 置
                                    </button>
                                </div>

                                {if !isset($data)}
                                <div class="btn-group float-right createContinueDiv">
                                    <input type="checkbox" class="form-check-input" value="1" id="_create"
                                        name="_create" title="继续添加数据">
                                    <label class="form-check-label" for="_create">继续添加</label>
                                </div>
                                {/if}
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>


<table>
    <tbody id="data-template" style="display: none">
        <tr>
            <td>
                <a class="btn btn-xs btn-primary" onclick="addNew(this,1)">插入</a>
                <a class="btn btn-xs btn-success" onclick="addNew(this,2)">追加</a>
                <a class="btn btn-xs btn-danger" onclick="delThis(this,1)">删除</a>
            </td>

            <td>
                <input class="form-control" placeholder="名称" name="kefuarr[]">

            </td>

        </tr>

    </tbody>
</table>


<script>
    /** 表单验证 **/
    $('#dataForm').validate({
        rules: {

        },
        messages: {

        }
    });

    function addNew(obj, type) {
        var template = $('#data-template').html();
        if (obj == null) {
            $("#dataBody").append(template);
        } else {
            if (type === 1) {
                $(obj).parent().parent().before(template);
            } else {
                $(obj).parent().parent().after(template);
            }
        }

        $('#dataBody select').select2();
    }

    function delThis(obj) {
        layer.confirm('您确认删除本行吗？', { title: '删除确认', closeBtn: 1, icon: 3 }, function () {
            $(obj).parent().parent().remove();
            layer.closeAll();
        });
    }
</script>

{if !isset($data)}
<script>
    $(function () {
        addNew(null, 1);
    });
</script>
{else/}
<script>
    $('#dataBody select').select2();
</script>
{/if}
{/block}